<template>
  <div id="windowCompatibilityReportsManage">
    <el-link type="success" disabled>接口地址：{{
        $store.state.obj_setting_map.api_compatibility_report_generate
      }}
    </el-link>
    <el-input
        v-model="koji_link"
        :autosize="{ minRows: 2, maxRows: 10 }"
        type="textarea"
        placeholder="输入KOJI地址"
    />
    <el-button style="width: 100%; margin-top: 5px" type="primary" plain @click="generate_report"
               v-loading="loading_btn_task_create">生成报告
    </el-button>
    <windowMessageReceive></windowMessageReceive>
    <div id="windowReportShowContent" :style="{ height: (height - 60) + 'px' }" v-loading="loading_report_info">

    </div>
  </div>
</template>

<script>
import axios from 'axios'
import check from "@/utils/check";
import {ElNotification} from 'element-plus'
import windowMessageReceive from "@/components/windowMessageReceive";
// import {Search} from '@element-plus/icons-vue'

export default {
  name: "windowCompatibilityReportsManage",
  props: {
    sessionToken: String,
    height: Number
  },
  components: {windowMessageReceive},
  data() {
    return {
      loading_report_info: false,
      loading_btn_task_create: false,
      koji_link: "",
      report_info: [],
      report_info_search: [],
      report_search_keyword: ""
    }
  },
  methods: {
    generate_report() {
      let obj_this = this
      if (!check.CheckKojiLink4CompatibilityReport(obj_this.koji_link)) {
        ElNotification({
          title: "Koji链接有问题（仅支持238）",
          type: 'error',
        })
        return
      }
      // 检查完成，接下来建立任务
      obj_this.loading_btn_task_create = true
      let api_compatibility_report_generate = obj_this.$store.state.obj_setting_map.api_compatibility_report_generate
      let data = {"koji_link": obj_this.koji_link}
      axios.post(api_compatibility_report_generate + "/api_compatibility_report_generate", data).then(function (response) {
        obj_this.task_moniter = setInterval(function () {
          obj_this.get_msg(response.data.data.task_id)
        }, 2000)
        console.log(response)
      }).catch(function (error) { // 请求失败处理
        console.log(error);
      });
    },
    get_msg(task_id) {
      let data = {"task_id": task_id}
      let obj_this = this
      let api_compatibility_report_generate = obj_this.$store.state.obj_setting_map.api_compatibility_report_generate
      axios.post(api_compatibility_report_generate + '/get_msg4task', data).then(function (response) {
        if (response.data.data.length > 0)
          for (let i = 0; i < response.data.data.length; i++) {
            if (response.data.data[i].msg_type === "msg") {
              obj_this.log_package += '\n[' + response.data.data[i].timestamp + '] ' + response.data.data[i].msg
              console.log(response.data.data[i].msg)
            } else if (response.data.data[i].msg_type === "link") {
              obj_this.package_result.package_link = api_compatibility_report_generate + '/' + response.data.data[i].link
              obj_this.package_result.package_name = response.data.data[i].filename
            }
            if (response.data.data[i].status_is_end) {
              console.log("所有数据接收完毕，关闭定时器")
              obj_this.loading_btn_task_create = false
              window.clearInterval(obj_this.task_moniter)
            }
          }
      }).catch(function (error) { // 请求失败处理
        console.log(error);
      });
    }
  },
}
</script>

<style scoped>
#windowCompatibilityReportsManage {
  padding: 10px;
}

#windowReportShowContent {
  height: 500px;
  overflow: auto;
}
</style>